<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>login</title>
		<link rel="stylesheet" type="text/css" href="../hui/static/h-ui/css/H-ui.min.css" />
	<link rel="stylesheet" type="text/css" href="../hui/static/h-ui.admin/css/H-ui.admin.css" />
	<link rel="stylesheet" type="text/css" href="../hui/lib/Hui-iconfont/1.0.8/iconfont.css" />
	<link rel="stylesheet" type="text/css" href="../hui/static/h-ui.admin/skin/default/skin.css" id="skin" />
	<link rel="stylesheet" type="text/css" href="../hui/static/h-ui.admin/css/style.css" />
	<link rel="stylesheet" href="../style/css/h-ui.admin/css/h-ui.admin.css">
	<link rel="stylesheet" href="../style/css/h-ui/css/H-ui.min.css">
	<link rel="stylesheet" href="../style/css/page.css">
	<link rel="stylesheet" href="style/css/public.css">
	<link rel="stylesheet" href="style/css/style.css">
</head>
<body>
		<div class="mt-20" style="width: 600px;margin:170px auto;border:1px solid #ccc;height: 300px;">
			<form action="" style="padding:0;margin-left: 50px;">
				<div class=" cl" style="margin-top: 50px;">
					<label class="f-l">用户名：</label>
					<div class="f-l">
						<input type="text" class="input-text editer"  name="username" id="username" style="margin-left: 46px;">
						<span class="username-span"></span>
					</div>
				</div>
				<div class=" cl" style="margin-top: 50px;">
					<label class="f-l">密&nbsp;&nbsp;&nbsp;码：</label>
					<div class="f-l">
						<input type="password" class="input-text editer" autocomplete="off"  name="password" id="password" style="margin-left: 46px;">
						<span class="password-span"></span>
					</div>
				</div>
				<div  style="margin:50px 0 0 100px;">	
					<submit class="btn" style="width: 300px;height: 48px;line-height: 48px;font-size: 16px;">登录</submit>
				</div>
			</form>
		</div>
</body>
	
<script type="text/javascript" src="../hui/lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript">
	$('#username').on('focus',function(){
		$('.username-span').html('');
				
	})
	
	$('#username').on('blur',function(){
		var username=$('#username').val();
		if(username==''){
			$('.username-span').html('用户名不能为空').css('color','red');
		}			
	})
	$('#password').on('blur',function(){
		var password=$('#password').val();
		if(password==''){
			$('.password-span').html('密码不能为空').css('color','red');	
		}	
	})
	$('#password').on('focus',function(){
		$('.password-span').html('');			
	})
	$('.btn').on('click',function(){
		var username=$('#username').val();
		var password=$('#username').val();
		if(username==''){
			$('.username-span').html('用户名不能为空').css('color','red');
		}
		if(password==''){
			$('.password-span').html('密码不能为空').css('color','red');	
		}
	})
</script>
</html>